<template>
	<tr>
		<td>{{color}}</td>
		<td @click.stop="tdClick(size,color)" style="position: relative;" v-for="(size,sizeindex) in sizes" :key="sizeindex">
			<span style="font-size:16px;">{{size}}</span>
			<view v-if="pro.proConfig.findIndex(item=>item.color==color&&item.size == size)>=0" style="position: absolute;right: 0;bottom: 0;">
				<u-icon  name="checkmark" class="icon-class" style="font-size:36px;" color="red">
				</u-icon>
			</view>
			
		</td>
	</tr>
</template>

<script>
	export default {
		props: ["color", "sizes", "pro"],
		// #ifdef MP-WEIXIN
		options: {
			// 微信小程序中 options 选项
			virtualHost: true, //  将自定义节点设置成虚拟的，更加接近Vue组件的表现。我们不希望自定义组件的这个节点本身可以设置样式、响应 flex 布局等，而是希望自定义组件内部的第一层节点能够响应 flex 布局或者样式由自定义组件本身完全决定
		},
		// #endif
		methods: {
			tdClick(size, color) {
				this.$emit("tdClick", {
					size,
					color
				})
			}
		}
	}
</script>

<style>
</style>